<!-- eslint-disable vue/no-mutating-props -->
<template>
    <div>
        <el-dialog title='修改会员' :visible.sync="isShow" center :before-close="cancel">
            <el-form :rules="rules" ref="memberRef">
                <el-form-item prop="phone" label="手机号" :label-width="formLabelWidth">
                    <el-input v-model="memberFrom.phone" autocomplete="off"></el-input>
                </el-form-item>
                <el-form-item prop="nickname" label="昵称" :label-width="formLabelWidth">
                    <el-input v-model="memberFrom.nickname" autocomplete="off"></el-input>
                </el-form-item>
                <el-form-item prop="password" label="密码" :label-width="formLabelWidth">
                    <el-input v-model="memberFrom.password" autocomplete="off"></el-input>
                </el-form-item>
                <el-form-item prop="status" label="状态" :label-width="formLabelWidth">
                    <el-switch v-model="memberFrom.status" active-color="#13ce66" inactive-color="#ff4949" :active-value="1"
                        :inactive-value="2">
                    </el-switch>
                </el-form-item>

            </el-form>
            <div slot="footer" class="dialog-footer">
                <el-button @click="cancel">取 消</el-button>
                <el-button type="primary" @click="dialogFormVisible = false">确 定</el-button>
            </div>
        </el-dialog>
    </div>
</template>

<script>
export default {
  props: ['isShow'],
  data () {
    return {
      formLabelWidth: '120px',
      memberFrom: {
        uid: '', // 会员编号，必填项
        nickname: '', // 昵称\
        phone: '', // 手机号
        password: '', // 密码
        status: 1// 状态1正常2禁用
      },
      rules: {
        phone: [
          { required: true, message: '请输入手机号', trigger: 'blur' },
          { min: 8, max: 11, message: '长度在 8 到 11 个字符', trigger: 'blur' }
        ],
        nickname: [
          { required: true, message: '请输入昵称', trigger: 'blur' },
          { min: 3, max: 5, message: '长度在 3 到 5 个字符', trigger: 'blur' }
        ],
        password: [
          { required: true, message: '请输入密码', trigger: 'blur' },
          { min: 6, max: 12, message: '长度在 6 到 12 个字符', trigger: 'blur' }
        ]
      }

    }
  },
  methods: {
    cancel () {
      this.$emit('cancel', false)
      this.reset()
    },
    reset () {
      this.memberFrom = {
        uid: '', // 会员编号，必填项
        nickname: '', // 昵称\
        phone: '', // 手机号
        password: '', // 密码
        status: 1// 状态1正常2禁用
      }
      this.$refs.memberRef.resetFields()
    }
  }
}
</script>

<style lang="" scoped>

</style>
